<template>
  <el-config-provider :locale="langValue">
    <el-button @click="changeLang(zhCn)">中文</el-button>
    <el-button @click="changeLang(en)">英文</el-button>
    <router-link to="/">
      首页
    </router-link>
    <router-link to="/mine">
      个人中心
    </router-link>
    <router-view />
  </el-config-provider>
</template>

<script setup lang="ts">
import { getCurrentInstance, ref } from 'vue'
import zhCn from 'element-plus/es/locale/lang/zh-cn' // 中文
import en from 'element-plus/es/locale/lang/en' // 英文
import { useI18n } from 'vue-i18n';
const { proxy }: any = getCurrentInstance() // 全局调用
proxy.$message('aisadjknsa')

// 语言切换
const langValue = ref(zhCn)
const { locale: localLanguage } = useI18n() // 给local重新换一个值
const changeLang = (language: any) => {
  langValue.value = language
  localLanguage.value = language.name
}
</script>

<style scoped lang="scss"></style>
